<template>
	<view>
		<view class="l1" v-for="item in list">
			<u-tag :text="item.label"></u-tag>
			<text>姓名：{{item.name}}</text>
			<text>电话：{{item.phone}}</text>
			<text>地址：{{item.addressDetail}}</text>
			<view class="l2">
				<u-button type="error" text="删除" style="width: 100px;" :plain="true" @click="deleteadd(item.id)"></u-button>
				<u-button type="primary" text="修改" style="width: 100px;" :plain="true" @click="getaddress(item.id)"></u-button>
			</view>
		</view>
		<u-button type="primary" text="新增地址" @click="tonext"></u-button>
		<u-popup :show="key" mode="center" round="15" :closeable="true" @close="key=false">
			<view class="l3">
				<view class="l4">
					<text>姓名：</text>
					<input placeholder="请输入姓名" v-model="name"/>
				</view>
				<u-line></u-line>
				<view class="l4">
					<text>标签：</text>
					<input placeholder="请输入标签" v-model="label"/>
				</view>
				<u-line></u-line>
				<view class="l4">
					<text>电话：</text>
					<input placeholder="请输入电话" v-model="phone"/>
				</view>
				<u-line></u-line>
				<view class="l4">
					<text>地址：</text>
					<textarea placeholder="请输入地址" v-model="address"></textarea>
				</view>
				<u-line></u-line>
				<u-button type="primary" text="保存" @click="modify"></u-button>
			</view>
		</u-popup>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				list:[],
				key:false,
				detail:{},
				name:'',
				label:'',
				phone:'',
				address:'',
				id:0
			}
		},
		onLoad() {
			this.getlist()
		},
		methods: {
			getlist(){
				this.api.get('/prod-api/api/takeout/address/list').then(res=>{
					this.list=res.data.data
				})
			},
			getaddress(id){
				this.key=true
				this.id=id
				this.api.get('/prod-api/api/takeout/address/'+id).then(res=>{
					this.name=res.data.data.name
					this.phone=res.data.data.phone
					this.label=res.data.data.label
					this.address=res.data.data.addressDetail
				})
			},
			modify(){
				if(this.name===''||this.label===''||this.phone===''||this.address===''){
					uni.showToast({
						title:'参数错误',
						icon:'error'
					})
					return
				}
				const data={
					id:this.id,
					name:this.name,
					phone:this.phone,
					addressDetail:this.address,
					label:this.label
				}
				this.api.get('/prod-api/api/takeout/address','PUT',data).then(res=>{
					if(res.data.code===200){
						setTimeout(function(){
							uni.showToast({
								title:'修改成功'
							})
						},700)
						this.getlist()
					}
					this.key=false
					// uni.redirectTo({
					// 	url:'/pages/other/takaway/address/address'
					// })
				})
			},
			deleteadd(id){
				this.api.get('/prod-api/api/takeout/address/'+id,'DELETE').then(res=>{
					if(res.data.code===200){
						setTimeout(function(){
							uni.showToast({
								title:'删除成功'
							})
						},700)
						this.getlist()
					}
				})
			},
			tonext(){
				uni.navigateTo({
					url:'/pages/other/takaway/address/addaddress/addaddress'
				})
			}
		}
	}
</script>

<style lang="scss">
.l1{
	width: 250px;
	border: 1px solid mediumpurple;
	display: flex;
	flex-direction: column;
	line-height: 35px;
	margin: 20px auto;
	border-radius: 10px;
	.l2{
		display: flex;
		margin-bottom: 20px;
	}
}
.l4{
	margin-top: 20px;
	margin-bottom: 20px;
	display: flex;
}
</style>
